<template>
  <div class="app-container" v-loading="loading">
    <el-form ref="form" :model="form" label-width="" class="el-form">
      <!-- {{ menuList }} -->
      <!-- {{ menuValue }} 11111111-->
      <!-- 000 -->
      <div class="disp-from-flxe">
        <el-form-item label="人数">
          <el-input-number
            @change="cheNumDan"
            :min="0"
            v-model="appDan.num"
          >
          </el-input-number>
        </el-form-item>
        <el-form-item label="备注">
          <el-input v-model="appDan.remark">
          </el-input>
        </el-form-item>
      </div>
      <el-form-item label="">
          <el-card
            class="kuang_lb box-card-taocan"
            v-for="(item, index) in menuArr"
            :key="index"
          >
            <div slot="header" class="clearfix">
              <el-radio v-model="appDan.mealId" :label="item.id" border>{{
                item.name
              }}</el-radio>
            </div>
            <el-table
              ref="multipleTable"
              :data="item.details"
              tooltip-effect="dark"
              style="width: 100%"
              max-height="500"
            >
              <el-table-column label="菜谱" prop="menuName">
              </el-table-column>
            </el-table>
            <!-- <div :key="cIndex" v-for="(cItem, cIndex) in item.details">
              {{ cItem.menuName }}
            </div> -->
          </el-card>
        </el-form-item>
    </el-form>

    <div slot="footer" class="dialog-footer">
      <el-button @click="$emit('cancel')">关闭</el-button>
      <el-button type="primary" @click="submitFileForm">确 定</el-button>
    </div>
  </div>
</template>
      <script>
import { getMealInfoArr } from "@/api/system/meal";
import { addDose } from "@/api/system/dose_manage";
// import { Dict } from "core-js";
export default {
  name: "checMenu",
  props: {
    typeArr: {
      type: Array,
      default: () => [],
    },
    checObj: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      loading: true,
      menuArr: [],
      menuValue: null, //选项id
      form: {},
      tableDataMenuSelect: [],
      appDan: {
        val: null,
        mealId: null, //套餐id
        num: 0,
        open: false,
        menuArr: [],
        index: 0,
        remark: "",
        data: {
          num: 0,
          typeName: "",
          id: "",
        },
      },
    };
  },
  created() {
    // console.log(this.checObj);
    if (this.checObj.tableDataMenuSelect.length > 0) {
        var res = this.checObj.tableDataMenuSelect[0]
        this.appDan.mealId=res.id
        this.appDan.num=res.num
        this.appDan.remark=res.remark
    }
    this.tableDataMenuSelect = this.checObj.tableDataMenuSelect;
    this.menuValue = this.checObj.val;
    this.checObj.tableDataMenuSelect;
    this.menuArr.push(...this.checObj.tableDataMenuSelect);
    console.log(this.menuArr);
    console.log(this.menuValue);
    this.show();
  },
  methods: {
    cheNumDan(e) {
      if (e == undefined) {
        this.appDan.val = 0;
      }
    },
    show() {
      getMealInfoArr({ pageNum: -1, pageSize: -1, cate: 0 }).then(
        (response) => {
          this.menuArr = response.rows;
        }
      );
      this.loading = false;
    },
    submitFileForm() {
        if (this.appDan.mealId == null) {
        this.$modal.msg("请选择套餐");
        return;
      }
      var data = {
        weekStart: this.checObj.weekStart,
        weekEnd: this.checObj.weekEnd,
        week: this.checObj.week,
        weekTag: this.checObj.weekTag,
        params: {
          doseDetails: [],
        },
      };
      var arr = [{
        mealId:this.appDan.mealId,
        num:this.appDan.num,
        remark:this.appDan.remark,
        time:this.checObj.type
      }];
      
      data.params.doseDetails = arr;
      console.log(data);
      // this.loading = true
        // return;
      addDose(data).then((response) => {
        console.log(response);
        // this.loading = false
        this.$emit("submitFileForm");
      });
    },
  },
};
</script>
              
      
  <style scoped>
.app-container {
  padding: 0;
}

.box-card-taocan {
  margin-bottom: 20px;
}
.el-dialog__body {
  height: calc(100% - 80px);
}
</style>